.container {
  .header-row {
    display: flex;
    flex-direction: row-reverse;
    .ivu-dropdown {
      margin-top: -10px;
      margin-bottom: 20px;
    }
    .ivu-dropdown-rel a {
      color: var(--font-color);
      font-size: 14px;
    }
  }

  .topic-row {
    display: flex;
    flex-wrap: wrap;
    .topic-card {
      width: 32%;
      border: 1px solid hsla(0, 0%, 0%, 0.04);
      border-radius: 8px;
      position: relative;
      box-sizing: border-box;
      overflow: hidden;
      margin-bottom: 15px;

      &:not(:nth-child(3n)) {
        margin-right: calc(6% / 3);
      }

      /deep/.ant-card-cover {
        width: 100%;
        height: 110px;
        overflow: hidden;
        cursor: auto;

        img {
          width: 100%;
          height: 100%;
          object-fit: cover;
        }
      }

      /deep/ .ant-card-body {
        width: 100%;
        height: 120px;
        padding: 0;

        .ant-card-meta {
          margin: -27px 0;

          .topic-avatar {
            margin-left: 30px;
          }

          .card-content-item {
            width: 100%;
            padding-left: 15px;
            padding-right: 15px;
            padding-top: 3px;

            .topic-title {
              width: 100%;
              font-size: 15px;
              color: var(--font-color);
              letter-spacing: 0;
              text-align: left;
              line-height: 25px;
              font-weight: 600;
              z-index: 4;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              margin-bottom: 3px;
            }

            .topic-description {
              width: 100%;
              font-size: 12px;
              color: var(--title-color);
              line-height: 20px;
              display: -webkit-box;
              height: 40px;
              -webkit-box-orient: vertical;    /* 使盒子垂直排列子元素 */
              -webkit-line-clamp: 2;           /* 限制显示两行 */
              overflow: hidden;                /* 隐藏超出内容 */
              text-overflow: ellipsis;         /* 添加省略号 */
              white-space: normal;
              margin-bottom: 3px;
            }

            .topic-viewCount {
              color: var(--title-color);
              font-size: 12px;

              span {
                color: var(--font-color);
                font-weight: 500;
              }
            }
          }
        }
      }
    }
  }
}
